import { useState } from 'react'

export const day02_02 = function () {
    const { value, toggle } = useToggle()

    return (
        <>
            <h3>day02_02</h3>
            <button onClick={toggle}> ToggleSon </button>
            {value && <Son />}
        </>
    )
}

function Son() {
    return (
        <>
            <div>Component Son</div>
        </>
    )
}

function useToggle() {
    const [value, setValue] = useState(true)
    const toggle = () => setValue(!value)

    return {
        value,
        toggle,
    }
}
